<template>
	<div class="page">
		<van-nav-bar :border="false" :placeholder="true" :fixed="true" title="thông tin đặt hàng" left-arrow
			@click-left="onClickLeft">
		</van-nav-bar>
		<div class="sin-wrap">
			<div class="bankpay-list">
				<div class="wrapper-header" >
					<p class="title"> Vui lòng chuyển tiền vào tài khoản sau </p>
				</div>
				<div  class="card bankBox"  >
					<div class="item">
						<div class="item-left">
							<div class="title">Người nhận tiền</div>
							<div class="items">NGUYEN DUC TIEP</div>
						</div><span class="copyText">Copy </span>
					</div>
					<div class="item">
						<div class="item-left">
							<div class="title">Số tài khoản</div>
							<div class="items">668154078</div>
						</div><span class="copyText">Copy </span>
					</div>
					<div class="item">
						<div class="item-left">
							<div class="title">Chi nhánh ngân hàng</div>
							<div class="items">ACBbank</div>
						</div><span class="copyText">Copy </span>
					</div>
				</div>
				<div class="wrapper-header" >
					<p class="title">Thông tin tiền nạp</p>
				</div>
				<div  class="card moneyBox" 
					>
					<div class="transferInMoneyList">
						<p class="transferInText">Chọn nhanh tiền nạp</p>
						<div class="moneyGrid">
							<div class="van-grid" >
								<div class="van-grid-item" @click="onTabquic(item.value)" v-for="(item,index) in tabsquic" :key="index" :class="quickcur == index?'active':''" style="flex-basis: 20%;">
									<div class="moneyList">{{item.label}}</div>
								</div>
							</div>
						</div>
					</div>
					<div class="payAmmout">
						<van-field v-model="revalue" placeholder="20,000-99,999,999" />
					</div>
					<div class="item">
						<div class="item-left">
							<div class="title">Nội Dung Giao Dịch</div>
							<div class="items">JubKkr</div>
						</div><span class="copyText">Copy </span>
					</div>
					<div class="payPrompt">
						<p > Vui lòng nhập Nội Dung Giao Dịch vào nội dung chuyển
							tiền để đảm bảo cập nhật số tiền nhanh chóng </p>
					</div>
				</div>
				<div class="send" >
					<div class="btn cancelBtn" @click="onClickLeft"> Huỷ </div>
					<div class="btn submit"> Chuyển khoản thành công </div>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				revalue: '',
				quickcur: 0,
				tabsquic: [{
					label: '1K',
					value: '1000'
				}, {
					label: '5K',
					value: '5000'
				}, {
					label: '10K',
					value: '10000'
				}, {
					label: '50K',
					value: '50000'
				}, {
					label: '100K',
					value: '100000'
				}, {
					label: '500K',
					value: '1000'
				}, {
					label: '1M',
					value: '1000'
				}, {
					label: '5M',
					value: '1000'
				}, {
					label: '10M',
					value: '1000'
				}, {
					label: '50M',
					value: '1000'
				}],
			}
		},
		methods: {
			url(url) {
				this.$router.push({
					path: url
				})
			},
			onTabA(e) {
				this.curA = e
			},
			onClickLeft() {
				this.$router.go(-1)
			},
			onTabquic(e) {
				this.revalue = e
			},
		}
	}
</script>
<style>
</style>
